<template>
<div>
<h2 class='name'>我是{{name}}</h2>
</div>
</template>

<script>
export default {
    name:'School',
    data(){
        return {
            name:'东软'
        }
    }
}
</script>


<style scoped>
    .name{
        background: lightblue;
    }

    /* 脚手架中编写样式的小技巧scoped */

    /* 组件的样式是可以串到一起的，你看Student里面没有写样式，它照样用上了School里面的样式,他们都被App组件引入了 */

    /* 你给style标签加个scoped就行了,样式就是属于组件自己的了 */

    /* 要是有些样式很多组件都在用,你可以考虑写在App里面去 */

    /* 给style标签加属性lang = 'less'(不写默认css)你就能用less语法了,但是你需要先有less的loader,脚手架里面没有自带这个loader,npm i less-loader,要注意loader的版本和webpack的版本要贴合才行,不然不行 */
</style>